html, body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
:root {
    --color-primary: #2c3e50;
    --color-primary-2: #34495e;
}

::-webkit-input-placeholder {
    color: #ccc;
}

html {
    background-color: #f2f2f2;
    color: var(--color-primary);
}

.logo-container{
    height:64px;
}

.panel {
    background-color: #ffffff;
}

.panel-row {
    display: flex;
    flex-direction: row;
}

.panel-title {
    font-size: 16px;
    border-bottom: 1px solid #f2f2f2;
    position: relative;
    padding-left: 2rem;
}

.panel-title::before {
    position: absolute;
    left: 20px;
    top: 25px;
    content: " ";
    width: 4px;
    height: 15px;
    border-radius: 2px;
    background-color: var(--color-primary);
}

.bp-td {
    height: 32px;
}

.color-primary {
    color: var(--color-primary);
}

.text-center {
    text-align: center;
}


.circle-progress-value {
    stroke-width: 6px;
    stroke: var(--color-primary);
}

.circle-progress-circle {
    stroke-width: 6px;
    stroke: #f2f2f2;
}

.circle-progress-text {
    fill: #c1c1c1;
}